<template>
	<view class="flex-col page">
		<view class="flex-col group">
			<view class="flex-col" v-if="havedata">
				<view class="flex-col list_1" :key="i" v-for="(item, i) in list">
					<view v-if="item.desc || item.conversationID">
						<view class="flex-row list-item" @click="goDeatil(item)">
							<view class="flex-col items-center group_8">
								<image :src="item.img" class="image_6" />
								<view class="flex-col items-center badge" v-if="item.num>0"><text
										class="text_1">{{item.num}}</text></view>
							</view>
							<view class="flex-col items-start group_2">
								<text class="text_3">{{item.name}}</text>
								<text class="text_5">{{item.desc}}</text>
							</view>
						</view>
						<image :src="imgUrl+'16557862506497898294.png'" class="list-divider image_1" v-if="i !== 1" />
					</view>


				</view>
			</view>
			 <view class="" v-else>
	  	<u-empty style="height: 70vh;" width="250" mode="data" textSize="30rpx"
	  		icon="http://cdn.uviewui.com/uview/empty/order.png">
	  	</u-empty>
	  </view>
			<view class="flex-col items-end section_2 " v-if="havedata">
				<view class="flex-col items-center text-wrapper_2" @click="empty"><text class="text_13">全部已读</text>
				</view>
			</view>
			
		</view>



	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				  unreadCount:0,
				havedata: false,
				userID: '',
				imgUrl: this.$IMG_URL,
				list: [{
						img: this.$IMG_URL + 'my/message/m1@2x.png',
						type: 0,
						num: 0,
						name: '平台公告',
						desc: ''
					},
					{
						img: this.$IMG_URL + 'my/message/m2@2x.png',
						type: 1,
						num: 0,
						name: '巡检时间提示',
						desc: ''
					},

				],
			};
		},
		onShow() {
			this.init();
		},
		onPullDownRefresh() {
		console.log('refesh');
		
		     this.init();
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		mounted() {
			// let num = 0;
			// this.list.map(item => {
			// 	if (item.desc || item.conversationID) {
			// 		num += 1;
			// 	}

			// })
			// if (num > 0) {
			// 	this.havedata = true;
			// }
		},
		methods: {
			init() {
				this.getGonggao();
				this.getMaterial();
				this.queryOrderMessage();
			},
			empty() {

				uni.showModal({
					title: '提示',
					// 提示文字
					content: '确认全部已读吗？',
					// 取消按钮的文字自定义
					cancelText: "取消",
					// 确认按钮的文字自定义
					confirmText: "确认",
					//删除字体的颜色
					confirmColor: 'red',
					//取消字体的颜色
					cancelColor: '#000000',
					success: res => {
						if (res.confirm) {
							this.$http('message.empty').then(r => {
								if (r.code == 200) {
									this.init();

								}
							});
						} else {
							// 执行取消后的操作
						}
					}


				})
			},
			getGonggao() {
				this.$http('message.article', {
					pageNum: 1,
					pageSize: 1
				}).then(r => {
					if (r.code == 200) {
						if (r.code == 200 && r.data.length>0) {
							let item = this.list[0];
							this.unreadCount +=parseInt(item.num?item.num:0);
							item.num = r.data.msg;
							this.havedata=true;
							if (r.data.length > 0) {
								item.desc = r.data[0].summary;
							}
							this.$set(this.list, 0, item)
						} else {
							this.$set(this.list, 0, [])
						}
					}
				})
			},


			queryOrderMessage()
			{
				this.$http('message.queryOrderMessage',{
							  pageNum:1,
							  pageSize:1
				}).then(r=>{
					// console.log('ordermessage');
					// console.log( r.data.length);
					 if(r.code==200 && r.data.length>0){
						let item=this.list[3];
						item.num=r.msg;
						this.unreadCount +=parseInt(item.num?item.num:0);
						this.havedata=true;
						if(r.data.length>0){
							item.desc=r.data[0].message;
						}

						this.$set(this.list,3,item) 
					 }else{
						this.$set(this.list,3,[]) 
					}	 
				});
			},
			getMaterial()
			{
				this.$http('message.materialInformationId').then(r=>{
				    if(r.code==200 && r.data.hasOwnProperty('information'))
					{
						console.log('aaaa');
						let item=this.list[1];
						item.num=r.data.size;
						item.name=r.data.information;
						item.desc=r.data.tips;
						this.havedata=true;		
						this.unreadCount +=parseInt(item.num?item.num:0);
					    this.$set(this.list,1,item)
					}else{
						 this.$set(this.list,1,[])
					}
				});
			},



			goDeatil(item) {
				let url = '';
				switch (item.type) {
					case 0:
						url = '/pages/common/myInfo/pingtaiMessage';
						break;
					case 1:
						url = '/pages/common/myInfo/orderMessage';
						break;
						// case 2: url='/pages/common/myInfo/xunjianMessage';
						// break;
						// case 3: url='/pages/common/myInfo/orderMessage';
						// break;
						// case 4: url='/pages/common/myInfo/kefu';
						// break;

				}

				uni.navigateTo({
					url: url
				});
			}
		},
	};
</script>

<style scoped lang="scss">
	.list-item {
		padding: 30rpx 32rpx 31rpx;
	}

	.list-divider {
		align-self: flex-end;
		width: 572rpx;
		height: 2rpx;
	}

	.badge {
		width: 26rpx;
		height: 26rpx;
		// padding:10rpx;
		// padding-bottom: 2rpx;
		border-radius: 50%;
		background-color: #F2362F;
		// background-image: url('https://codefun-proj-user-res-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b127f6d029820011531bae/16557862506546894742.png');
		// background-size: 100% 100%;
		// background-repeat: no-repeat;
		// width: 24rpx;
		position: absolute;
		right: 0;
		top: 0;
	}

	.text_3 {
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_5 {
		margin-top: 22rpx;
		color: #999999;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_1 {
		color: #ffffff;
		font-size: 18rpx;
		font-family: '.AppleSystemUIFont';

	}

	.page {
		background-color: #f6f7f9;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		height: 100vh;
	}

	.group {
		flex: 1 1 auto;
		overflow-y: auto;
	}

	.section_2 {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		padding: 20rpx 0;
		background-color: #ffffff;
		box-shadow: 0px -2rpx 4rpx 0px #00000014;
	}

	.list_1 {
		background-color: #ffffffff;
	}

	.text-wrapper_2 {
		margin-right: 32rpx;
		padding: 9rpx 0 19rpx;
		background-color: #1d6aff14;
		border-radius: 28rpx;
		width: 148rpx;
	}

	.text_13 {
		color: #1d6aff;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.image_1 {
		margin-right: 32rpx;
	}

	.group_8 {
		filter: drop-shadow(0px 3rpx 3rpx #c1000066);
		width: 90rpx;
		height: 90rpx;
		position: relative;
	}

	.group_2 {
		margin-left: 24rpx;
		margin-bottom: 9rpx;
		flex: 1 1 auto;
	}

	.image_6 {
		filter: drop-shadow(0px 3rpx 3rpx #c1000066);
		width: 90rpx;
		height: 90rpx;
	}
</style>
